import React, {Component} from 'react'
import {inject, observer} from 'mobx-react';
import {observable,action,toJS} from 'mobx';
import TopSearchPanel from "./TopSearchPanel";

import WeaWhitePage from "../../../Component/wea-white-page"
import {Tabs} from 'antd'
const TabPane = Tabs.TabPane
import {WeaNewScroll} from 'ecCom';
import Fan from "./Fan"

import { WeaLocaleProvider } from "ecCom";
const getLabel = WeaLocaleProvider.getLabel;

@inject('blogMyBlog')
@observer
class Fans extends Component {
    render() {
        let {height, data = []} = this.props
        return (
            <Tabs ecId={`${this && this.props && this.props.ecId || ''}_Tabs@1doii9`} activeKey="fans" size="small"
                  tabBarExtraContent={<TopSearchPanel ecId={`${this && this.props && this.props.ecId || ''}_TopSearchPanel@qta1aa`} requestData={this.getList}/>}
            >
                <TabPane ecId={`${this && this.props && this.props.ecId || ''}_TabPane@de35jr`} tab={getLabel(131542,"我的粉丝")} key="fans">
                
                        <WeaNewScroll ecId={`${this && this.props && this.props.ecId || ''}_WeaNewScroll@lozg54`} height={height - 61}>
                            <div className="wea-myBlog-fan">
                                {
                                    data.length ? (
                                        <div style={{padding: "0 8px"}}>
                                            {
                                                data.map(
                                                    item => {
                                                        return <Fan ecId={`${this && this.props && this.props.ecId || ''}_Fan@7oa6fy@${item.userid}`} data={item} type="fan" />
                                                    }
                                                )
                                            }
                                        </div>
                                    ) : <WeaWhitePage ecId={`${this && this.props && this.props.ecId || ''}_WeaWhitePage@7wpchd`} height={height}/>
                                }
                            </div>
                        </WeaNewScroll>
                    </TabPane>
                </Tabs>
        )
    }

    getList = (params) => {
        this.props.blogMyBlog.getFanList(params)
    }
}

export default Fans